import React, { useEffect, useState } from 'react';
import { getTourist } from '@/api/service'
import { Table, Tag } from 'antd';
import { useAddkey } from '@/hooks/index'
import axios from 'axios';
import { AudioOutlined } from '@ant-design/icons';
import { Input, Space } from 'antd'
const columns = [
  {
    title: 'ID',
    dataIndex: 'log_id',
    key: 'log_id',

  },
  {
    title: '发送人',
    dataIndex: 'from_name',
    key: 'from_name',
  },
  {
    title: '消息',
    dataIndex: 'message',
    key: 'message',
  },
  {
    title: '接收人',
    key: 'to_name',
    dataIndex: 'to_name',
  },
  {
    title: '创建时间',
    key: 'create_time',
    dataIndex: 'create_time',
  },
];
const { Search } = Input;

const suffix = (
  <AudioOutlined
    style={{
      fontSize: 16,
      color: '#1890ff',
    }}
  />
);
export default function chat() {
  const [data, setData] = useState([]);
  const [total, setTotal] = useState(1);
  useEffect(() => {
    axios.get('/getChat', {
      params: {

        search: ''

      }
    }).then((res: any) => {
      console.log(res);
      useAddkey(res.data);
      setData(res.data);
      setTotal(res.count)
    })
  }, [])
  const onSearch = (value: any) => {
    axios.get('/getChat', {
      params: {
        search: value
      }
    }).then((res: any) => {
      console.log(res);
      useAddkey(res.data);
      setData(res.data);
      setTotal(res.count)
    })
  }
  return <div>
    <Space direction="vertical">
      <Search
        placeholder="input search text"
        allowClear
        enterButton="Search"
        size="large"
        onSearch={onSearch}
      />
    </Space>
    <Table
      columns={columns}
      pagination={{
        total,
        pageSize: 5,
        showQuickJumper: true
      }}
      dataSource={data}
    />
  </div>;
}
